<template>
  <ul class="list">
    <li class="item" v-for="(item,key) in cities" :key="key">{{key}}</li>
  </ul>
</template>

<script>
    export default {
        name: 'CityABC',
        props: {
            cities: Object
        }
    }
</script>

<style lang="stylus" type="text/stylus" rel="stylesheet/stylus" scoped>
  @import '~styles/varibles.styl'
  @import '~styles/mixins.styl'
  /*.icons >>> .swiper-container*/
  .list
    right 0
    top 0.84rem
    bottom 0
    margin auto 0
    position absolute
    flex-direction: column
    justify-content: center
    display flex
    width 0.2rem

    .item
      height 0.2rem
      text-align center
      float right
      color: $bgColor

</style>
